// 查看回执弹窗
<template>
    <Modal width="800px" title="回执结果" :value="value" @input="modalChange">
        <Table :height="333" :loading="loading" :columns="columns" :data="list"></Table>
        <Pagination
            class="receipt-page"
            :pageSize.sync="pageSize"
            :current.sync="pageNum"
            :total="total"
            @change="queryList"
        />
        <div slot="footer">
            <Button type="primary" @click="close">关闭</Button>
        </div>
    </Modal>
</template>
<script>
import { queryInvtResponse } from '@/api/invt'
import formatTime from '@/libs/formatTime'

export default {
    props: {
        dataMainType: {
            type: String,
            default: 'Client-Invt'
        },
        value: {
            type: Boolean,
            default: false
        },
        invtId: {
            type: [String, Number],
            default: ''
        }
    },
    data () {
        return {
            columns: [
                {
                    title: '序列号',
                    type: 'index',
                    width: 80,
                    align: 'center'
                },
                {
                    title: '内部编号',
                    key: 'innerCode',
                    align: 'center',
                    width: 140
                },
                {
                    title: '操作时间',
                    key: 'messageTime',
                    align: 'center',
                    width: 160
                },
                {
                    title: '报文信息',
                    key: 'responseMessage',
                    align: 'center',
                    tooltip: true
                }
            ],
            list: [],
            loading: false,
            id: '',
            pageNum: 1,
            total: 0,
            pageSize: 10
        }
    },
    watch: {
        value (nValue) {
            if (nValue) {
                this.id = this.invtId
                this.search()
            }
        }
    },
    methods: {
        search () {
            this.pageNum = 1
            this.queryList()
        },
        modalChange (v) {
            this.$emit('input', v)
        },
        queryList () {
            this.loading = true
            queryInvtResponse({
                dataMainType: this.dataMainType,
                id: this.id,
                pageNum: this.pageNum,
                pageSize: this.pageSize
            }).then(res => {
                if (res.data.code === '0000') {
                    this.list = res.data.data.list.map(item => {
                        return {
                            innerCode: item.innerCode,
                            responseMessage: item.responseMessage,
                            // 回执时间精确到秒(TAPD_BUG:1021853)
                            messageTime: item.messageTime ? formatTime.fullTime(item.messageTime) : ''
                        }
                    })
                    this.total = res.data.data.total
                } else {
                    this.list = []
                    this.total = 0
                }
                this.loading = false
            }).catch(err => {
                this.loading = false
            })
        },
        close () {
            this.$emit('input', false)
            this.$emit('on-close')
        }
    }
}
</script>
<style lang="less" scoped>
.receipt-page {
    text-align: right;
    margin-top: 15px;
}
</style>
